<template>
	<view class="content">
		<text>{{title}}</text>
		<child :age="22" staticProp="staticProp" 
		:title="post.title"
		:is-published=true
		@changeOfSub="changeOfSub"
		></child>
		<view class="">{{titleOfSub}}</view>
		<!-- <p>---------</p> -->
		<!-- <child :title="post.title + ' by ' + post.author.name "></child> -->
		<!-- <p>---------</p> -->
		<!-- <child :likes="post.likes"></child> -->
	</view>
</template>

<script>
	import child from '../component/sub.vue'
	export default {
		components: {
			child
		},
		data() {
			return {
				title: 'home',
				titleOfSub: '',
				post: {
					title: 'language titile',
					author: {
						name: 'tom'
					},
					likes: 'news'
				}
			}
		},
		methods: {
			changeOfSub(res){
				console.log(res)
				this.titleOfSub = res;
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		/* align-items: center; */
		justify-content: center;
	}
</style>